.animated-border-tl,
.animated-border-br {
    position: relative;
    width: 21px;
    height: 21px;
}

/* === Top Left Box Borders === */
.animated-border-tl::before,
.animated-border-tl::after {
    content: '';
    position: absolute;
    background: linear-gradient(to right, #1a1a1a 0%, #348B26 10%, #1a1a1a 20%);
    background-size: 200% 100%;
    animation: animate-border 3s linear infinite;
}

.animated-border-tl::before {
    top: 0;
    left: 0;
    height: 10px;
    width: 100%;
}

.animated-border-tl::after {
    top: 0;
    left: 0;
    width: 10px;
    height: 100%;
}

/* === Bottom Right Box Borders === */
.animated-border-br {
    margin-left: 86%;
    margin-top: 30px;
}

.animated-border-br::before,
.animated-border-br::after {
    content: '';
    position: absolute;
    background: linear-gradient(to right, #1a1a1a 0%, #348B26 10%, #1a1a1a 20%);
    background-size: 200% 100%;
    animation: animate-border 3s linear infinite;
}

.animated-border-br::before {
    bottom: 0;
    right: 0;
    height: 10px;
    width: 100%;
}

.animated-border-br::after {
    bottom: 0;
    right: 0;
    width: 10px;
    height: 100%;
}

/* === Border Animation === */
@keyframes animate-border {
    0% {
        background-position: 200% 0;
    }
    100% {
        background-position: -200% 0;
    }
}

/* === Center Shine Text === */
.shine-animation {
    background: linear-gradient(to right, #1a1a1a 0, #348B26 10%, #1a1a1a 20%);
}

.svg-mask-animation {
    background: linear-gradient(to right, #1a1a1a 0%, #348B26 10%, #1a1a1a 20%);
}